<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp" %>
<!DOCTYPE HTML>
<html>
	<head>
		<%@ include file="/common/include/title.jsp" %>
		<link href="${rootPath }/common/resource/H-ui.admin/static/h-ui.admin/css/H-ui.login.css" rel="stylesheet" type="text/css" />
		<title>分类列表 - 景航电商</title>
		<meta name="keywords"
			content="登陆 景航电商">
		<meta name="description"
			content="登陆 景航电商">
	</head>
	<body>
		<nav class="breadcrumb">
			<i class="Hui-iconfont">&#xe67f;</i> 首页 
			<span class="c-gray en">&gt;</span>
			商品管理 <span class="c-gray en">&gt;</span> 
			分类列表 
			<a
				class="btn btn-success radius r btn-refresh"
				style="line-height: 1.6em; margin-top: 3px"
				href="javascript:location.replace(location.href);" title="刷新"><i
				class="Hui-iconfont">&#xe68f;</i></a>
		</nav>
		<div class="page-container">
			<form action="${rootPath}/back/goods/cateList.htm" method="post">
				<div class="text-c">
					<input type="text" class="input-text" style="width: 250px"
						name="keyword" value="${requestScope.keyword }" placeholder="请输入关键字">
					状态:
					<span class="select-box inline">
						<select name="status" class="select">
							<option value="">请选择</option>
							<option value="1" ${requestScope.status == '1' ? 'selected' : ''}>启用</option>
							<option value="0" ${requestScope.status == '0' ? 'selected' : ''}>禁用</option>
						</select>
					</span>
					日期范围：
					<input type="text" readonly="readonly" name="st" value="${requestScope.st }" placeholder="起始时间" 
					class="input-text Wdate" style="width: 160px;" onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd HH:mm:ss'})">
					-->
					<input type="text" readonly="readonly" name="ed" value="${requestScope.ed }" placeholder="起始时间" 
					class="input-text Wdate" style="width: 160px;" onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd HH:mm:ss'})">
					<button type="submit" class="btn btn-success radius" id="" name="">
						<i class="Hui-iconfont">&#xe665;</i> 搜索
					</button>
				</div>
				<div class="cl pd-5 bg-1 bk-gray mt-20">
					<span class="l">
						<a href="javascript:;" onclick="datadel()" class="btn btn-danger radius">
							<i class="Hui-iconfont">&#xe6e2;</i>
							批量删除
						</a>
						<a href="javascript:;" onclick="member_full('添加','${rootPath}/back/goods/cateInsert.htm')"
							class="btn btn-primary radius">
							<i class="Hui-iconfont">&#xe600;</i>
							添加
						</a>
					</span>
					<span class="r">
						共有数据：<strong>${requestScope.pageInfoUtil.totalRecord }</strong> 条
					</span>
				</div>
			</form>
			<div class="mt-20">
				<div id="DataTables_Table_0_wrapper"
					class="dataTables_wrapper no-footer">
					<table class="table table-border table-bordered table-hover table-bg table-sort">
						<thead>
							<tr class="text-c">
								<th width="25"><input type="checkbox" name="" value=""></th>
								<th width="80">序号</th>
								<th width="80">ID</th>
								<th width="80">管理员</th>
								<th width="100">上一级</th>
								<th width="100">名字</th>
								<th width="100">url</th>
								<th width="30">状态</th>
								<th width="130">创建时间</th>
								<th width="130">更新时间</th>
								<th width="130">发布时间</th>
								<th width="100">操作</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="${requestScope.cateList }" var="cate" varStatus="stat">
								<tr class="text-c">
									<td><input type="checkbox" value="1" name=""></td>
									<td>${stat.count }</td>
									<td>${cate.id }</td>
									<td>${cate.adminsId }</td>
									<td>${cate.parentCate.name }</td>
									<td><a href="#" onclick="member_full('添加','${rootPath}/back/goods/cateUpdate.htm?id=${cate.id}')">${cate.name}</a></td>
									<td>${cate.url}</td>
									<td class="td-status">
										<span class="label label-success radius">
											<c:choose>
												<c:when test="${cate.status == 1}">启用</c:when>
												<c:when test="${cate.status == 0}">禁用</c:when>
												<c:otherwise>
													未知
												</c:otherwise>
											</c:choose>
										</span>
									</td>
									<td><fmt:formatDate value="${cate.createTime }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
									<td><fmt:formatDate value="${cate.updateTime }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
									<td><fmt:formatDate value="${cate.pubTime }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
									<td class="td-manage">
										<a style="text-decoration: none" onClick="member_stop(this,'10001')" href="javascript:;"
											title="停用">
											<i class="Hui-iconfont">&#xe631;</i>
										</a>
										<a title="编辑" href="javascript:;" onclick="member_full('编辑','${rootPath}/back/goods/cateUpdate.htm?id=${cate.id}&operType=update')"
											class="ml-5" style="text-decoration: none">
											<i class="Hui-iconfont">&#xe6df;</i>
										</a>
										<a style="text-decoration: none" class="ml-5" onClick="change_password('修改密码','change-password.html','10001','600','270')"
											href="javascript:;" title="修改密码">
											<i class="Hui-iconfont">&#xe63f;</i>
										</a>
										<a title="删除" href="javascript:;" onclick="member_del(this,'1')" class="ml-5"
											style="text-decoration: none">
											<i class="Hui-iconfont">&#xe6e2;</i>
										</a>
									</td>
								</tr>
							</c:forEach>
						</tbody>
					</table>
					<div class="dataTables_paginate paging_simple_numbers"
						id="DataTables_Table_0_paginate">
						<form action="${rootPath}/back/goods/cateList.htm" method="post" id="pageForm">
							<input type="hidden" name="keyword" value="${requestScope.keyword }">
							<input type="hidden" name="status" value="${requestScope.status }">
							<input type="hidden" name="st" value="${requestScope.st }">
							<input type="hidden" name="ed" value="${requestScope.ed }">
							<a class="paginate_button previous disabled"
								aria-controls="DataTables_Table_0" data-dt-idx="0" tabindex="0"
								href="#" onclick="return pageInfoForm('1','${pageInfoUtil.pageSize}')"
								id="DataTables_Table_0_previous">
								首页
							</a>
							<a class="paginate_button previous disabled"
								aria-controls="DataTables_Table_0" data-dt-idx="0" tabindex="0"
								href="#" onclick="return pageInfoForm('${pageInfoUtil.prePage }','${pageInfoUtil.pageSize}')"
								id="DataTables_Table_0_previous">
								上一页
							</a>
							<!-- <span>
								<a class="paginate_button current" aria-controls="DataTables_Table_0"
									data-dt-idx="1" tabindex="0">
									1
								</a>
							</span> -->
							<a class="paginate_button next disabled"
								aria-controls="DataTables_Table_0" data-dt-idx="2" tabindex="0"
								href="#" onclick="return pageInfoForm('${pageInfoUtil.nextPage }','${pageInfoUtil.pageSize}')"
								id="DataTables_Table_0_next">
								下一页
							</a>
							<a class="paginate_button previous disabled"
								aria-controls="DataTables_Table_0" data-dt-idx="0" tabindex="0"
								href="#" onclick="return pageInfoForm('${pageInfoUtil.totalPage }','${pageInfoUtil.pageSize}')"
								id="DataTables_Table_0_previous">
								尾页
							</a>
							<span>
								共${requestScope.pageInfoUtil.totalRecord }条,共${requestScope.pageInfoUtil.totalPage }页
								第<input type="text" id="currentPage" name="currentPage" value="${requestScope.pageInfoUtil.currentPage }" size="5" maxlength="5" class="paginate_button">页
								每页<input type="text" id="currentPage" name="pageSize" value="${requestScope.pageInfoUtil.pageSize }" size="5" maxlength="5" class="paginate_button">条
								<input type="submit" value="GO" class="paginate_button" size="5" maxlength="5">
							</span>
						</form>
					</div>
				</div>
			</div>
		</div>
		<%@ include file="/common/include/footer.jsp" %>
	
		<!--请在下方写此页面业务相关的脚本-->
		<script type="text/javascript" src="${rootPath }/common/resource/H-ui.admin/lib/My97DatePicker/4.8/WdatePicker.js"></script>
		<script type="text/javascript" src="${rootPath }/common/resource/H-ui.admin/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
		<script type="text/javascript" src="${rootPath }/common/resource/H-ui.admin/lib/laypage/1.2/laypage.js"></script>
		
		<script type="text/javascript">
			$(function() {
				$('.table-sort').dataTable({
					"aaSorting" : [ [ 1, "desc" ] ],//默认第几个排序
					"bStateSave" : true,//状态保存
					"paging" : false,
					"aoColumnDefs" : [
					//{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
					{
						"orderable" : false,
						"aTargets" : [ 0, 8, 9 ]
					} // 制定列不参与排序
					]
				});
	
			});
			/*用户-添加*/
			function member_add(title, url, w, h) {
				layer_show(title, url, w, h);
			}
			
			/*用户-铺满整个屏幕*/
			function member_full(title, url) {
				var index = layer.open({
					type: 2,
					title: title,
					content: url
				});
				layer.full(index);

			}
			/*用户-查看*/
			function member_show(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*用户-停用*/
			function member_stop(obj, id) {
				layer
						.confirm(
								'确认要停用吗？',
								function(index) {
									$
											.ajax({
												type : 'POST',
												url : '',
												dataType : 'json',
												success : function(data) {
													$(obj)
															.parents("tr")
															.find(".td-manage")
															.prepend(
																	'<a style="text-decoration:none" onClick="member_start(this,id)" href="javascript:;" title="启用"><i class="Hui-iconfont">&#xe6e1;</i></a>');
													$(obj)
															.parents("tr")
															.find(".td-status")
															.html(
																	'<span class="label label-defaunt radius">已停用</span>');
													$(obj).remove();
													layer.msg('已停用!', {
														icon : 5,
														time : 1000
													});
												},
												error : function(data) {
													console.log(data.msg);
												},
											});
								});
			}
	
			/*用户-启用*/
			function member_start(obj, id) {
				layer
						.confirm(
								'确认要启用吗？',
								function(index) {
									$
											.ajax({
												type : 'POST',
												url : '',
												dataType : 'json',
												success : function(data) {
													$(obj)
															.parents("tr")
															.find(".td-manage")
															.prepend(
																	'<a style="text-decoration:none" onClick="member_stop(this,id)" href="javascript:;" title="停用"><i class="Hui-iconfont">&#xe631;</i></a>');
													$(obj)
															.parents("tr")
															.find(".td-status")
															.html(
																	'<span class="label label-success radius">已启用</span>');
													$(obj).remove();
													layer.msg('已启用!', {
														icon : 6,
														time : 1000
													});
												},
												error : function(data) {
													console.log(data.msg);
												},
											});
								});
			}
			/*用户-编辑*/
			function member_edit(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*密码-修改*/
			function change_password(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*用户-删除*/
			function member_del(obj, id) {
				layer.confirm('确认要删除吗？', function(index) {
					$.ajax({
						type : 'POST',
						url : '',
						dataType : 'json',
						success : function(data) {
							$(obj).parents("tr").remove();
							layer.msg('已删除!', {
								icon : 1,
								time : 1000
							});
						},
						error : function(data) {
							console.log(data.msg);
						},
					});
				});
			}
		</script>
	</body>
</html>